import 'package:flutter/material.dart';

void main() => runApp(StatefulGroupPage());

///StatefulWidget 与基础组件
class StatefulGroupPage extends StatefulWidget {
  @override
  _StatefulGroupPageState createState() => _StatefulGroupPageState();
}

class _StatefulGroupPageState extends State<StatefulGroupPage> {
  int _currentIndex = 0;

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'StatefulWidget 与基础组件',
      theme: ThemeData.fallback(),
      home: Scaffold(
        appBar: AppBar(
          title: Text('StatefulWidget 与基础组件'),
          leading: GestureDetector(
            onTap: () {
              Navigator.pop(context);
            },
            child: Icon(Icons.arrow_back),
          ),
        ),
        floatingActionButton: FloatingActionButton(
          onPressed: null,
          child: Text('点我'),
        ),
        bottomNavigationBar: BottomNavigationBar(
          currentIndex: _currentIndex,
          onTap: (index) {
            setState(() {
              _currentIndex = index;
            });
          },
          items: [
            // at least two Bar Items
            BottomNavigationBarItem(
              icon: Icon(Icons.home, color: Colors.grey,),
              activeIcon: Icon(Icons.home, color: Colors.blue,),
              title: Text('首页'),
            ),
            BottomNavigationBarItem(
              icon: Icon(Icons.list, color: Colors.grey,),
              activeIcon: Icon(Icons.list, color: Colors.blue,),
              title: Text('列表'),
            ),
          ]
        ),
        body: [
          RefreshIndicator(
            // 刷新组件需要配合列表进行使用
            child: ListView.builder(
              itemCount: 100,
              itemBuilder: (BuildContext context, int position) {
                return Text('Row $position', style: TextStyle(fontSize: 20),);
              },
            ),
            // 当列表下拉时，回调
            onRefresh: _handleRefresh,
          ),
          Container(
            decoration: BoxDecoration(color: Colors.white70),
            alignment: Alignment.center,
            child: Column(
              children: <Widget>[
                Image.network('http://www.devio.org/img/avatar.png'),
                TextField(
                  //输入文本的样式
                  decoration: InputDecoration(
                    contentPadding: EdgeInsets.fromLTRB(5, 0, 0, 0),
                    hintText: 'Please input',
                    hintStyle: TextStyle(fontSize: 24),
                  ),
                ),
                Container(
                  height: 100,
                  margin: EdgeInsets.only(top: 10),
                  decoration: BoxDecoration(color: Colors.lightBlue),
                  child: PageView(
                    children: <Widget>[
                      Text(
                        'Page1', 
                        style: TextStyle(fontSize: 22, color: Colors.yellowAccent)
                      ),
                      Text(
                        'Page2', 
                        style: TextStyle(fontSize: 22, color: Colors.redAccent)
                      ),
                      Text(
                        'Page3', 
                        style: TextStyle(fontSize: 22, color: Colors.greenAccent)
                      ),
                    ],
                  ),
                )
              ],
            ),
          ),
        ][_currentIndex],
      ),
    );
  }

  Future<void> _handleRefresh() async {
    await Future.delayed(Duration(milliseconds: 200));
    return null;
  }

}
